$icon:'../../assets/res/img/icon_re.png';
.icon{
    display: inline-block;
    vertical-align: middle;
    background-image: url($icon);
    background-repeat: no-repeat;
}
.qdet-l{
    display: inline-block;
    vertical-align: top;
}
.qdet-g{
    margin: 20px 0 14px 0;
}
.qdet-g a{
    color: #808080;
}
.qdet-g i{
    color: #808080;
    margin: 0 4px;
}
.qdet-l .ques{
    position: relative;
    height: 118px;
    padding: 30px 23px 0 45px;
}
.qdet-l .ques h1{
    font-weight: bold;
    line-height: 26px;
}
.qdet-l .ques .icon-ques{
    width: 36px;
    height: 32px;
    position: absolute;
    top: 0;
    left: 16px;
    background-position: -599px -403px;
}
.qdet-l .ques .tip{
    position: absolute;
    width: 810px;
    left: 45px;
    bottom: 14px;
    color: #808080;
}
.qdet-l .ques .tip .price{
    height: 28px;
    line-height: 28px;
    color: #e94f4f;
    background-color: #fff2e2;
    border-radius: 14px;
    font-size: 12px;
    display: inline-block;
    vertical-align: middle;
    padding: 0 8px;
}
.qdet-l .ques .icon-def-img{
    width: 26px;
    height: 26px;
    background-position: -718px -403px;
    margin: 0 9px 0 16px;
}
.qdet-l .ques .tip i{
    margin-right: 20px;
}
.qdet-l .ques .tip a{
    color: #808080;
    margin-left: 20px;
}
.qdet-l .ques .tip .icon-collet{
    width: 20px;
    height: 20px;
    background-position:-127px -33px;
    margin-right: 4px;
    &.on{
        background-position: -127px 0;
    }
}
.qdet-l .ques .tip .icon-share{
    width: 20px;
    height: 20px;
    background-position: -66px -33px;
    margin-right: 4px;
}
.qdet-l .ans{
    padding: 30px 23px 0 45px;
    height: 180px;
    margin-top: 20px;
    position: relative;
    &.teacher {
      padding: 0;
      height: 210px;
    }
}
.qdet-l .ans .icon-ans{
    width: 36px;
    height: 32px;
    position: absolute;
    top: 0;
    left: 16px;
    background-position: -657px -403px;
}
.qdet-l .ans .photo{
    display: inline-block;
    vertical-align: top;
    width: 62px;
    height: 62px;
    position: relative;
}
.qdet-l .ans .photo .photo-img{
    width: 64px;
    height: 64px;
    border-radius: 50%;
}
.qdet-l .ans .photo .appr{
    position: absolute;
    right: 4px;
    bottom: -2px;
}
.qdet-l .ans .anser-info-c{
    display: inline-block;
    vertical-align: top;
    max-width: 580px;
    margin-left: 18px;
}
.qdet-l .ans .anser-info-c{
    color: #808080;
}
.qdet-l .ans .anser-info-c .name{
    color: #00a0e9;
}
.qdet-l .ans .anser-info-c .line{
    display: inline-block;
    vertical-align: middle;
    width: 1px;
    height: 16px;
    background-color: #e6e6e6;
    margin: -4px 12px 0 12px;
}
.qdet-l .ans .anser-info-c .h12{
    height: 12px;
}
.qdet-l .ans .anser-info-c p{
    margin-top: 18px;
}
.qdet-l .ans .anser-info button{
	height: 39px;
	background-color: #f23e3e;
    border-radius: 20px;
    color: #fff;
    margin: 12px 0;
    padding: 0 12px;
}
.qdet-l .ans .txt{
    line-height: 26px;
    height: 48px;
    overflow: hidden;
    text-overflow:ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-top: 19px;
    position: relative;
}
.qdet-l .ans .lock{
    -ms-filter: blur(5px);
    -webkit-filter: blur(5px);
    filter: blur(5px);
    position: relative;
}
.qdet-l .ans .unlock{
    position: absolute;
    width: 172px;
    height: 34px;
    line-height: 34px;
    color: #fff;
    background-color: #e94f4f;
    border-radius: 17px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    text-align: center;
}
.qdet-l .ans .unlock .icon-lock{
    height: 14px;
    width: 14px;
    background-position: 0 -36px;
    margin-right: 8px;
}
.qdet-l .ans .tip{
    width: 810px;
    position: absolute;
    bottom: 20px;
    left: 45px;
    color: #808080;
}
.qdet-l .ans .tip a{
    color: #808080;
}
.qdet-l .ans .tip .icon-praise{
  height: 20px;
  width: 20px;
  background-position: -191px -33px;
  margin-right: 6px;
  &.on {
    background-position: -191px 0;
  }
}
.qdet-l .ques .tip [collet] .on{
    background-position: -127px 0;
}
.risk{
    margin-top: 22px;
    padding-left: 16px;
    color: #808080;
}
.risk i{
    color: #f23e3e;
}
.other{
    margin-top: 40px;
}
.other .other-h{
    padding: 0 10px;
}
.other .other-h a{
    color: #808080;
}
.other .other-c{
    height: 270px;
    padding: 16px 0;
    margin-top: 15px;
    overflow: hidden;
    position: relative;
}
.swiper-container {
  height: 100%;
}
.other .other-c .swiper-item{
    width: 180px;
    padding: 0 20px;
    height: 100%;
    float: left;
    border-right: 1px solid #e6e6e6;
    position: relative;
    box-sizing: border-box;
}
.other .other-c .photo{
    position: relative;
    width: 79px;
    height: 79px;
    margin: 10px auto;
}
.other .other-c .photo .photo-img{
    width: 79px;
    height: 79px;
    border-radius: 50%;
}
.other .other-c .photo .appr{
    position: absolute;
    right: 10px;
    bottom: 0;
}
.other .other-c .name{
    text-align: center;
    display: block;
}
.other .other-c .tips{
    display: block;
    color: #808080;
    text-align: center;
    margin: 6px 0;
}
.other .other-c .tips .line{
    display: inline-block;
    vertical-align: middle;
    width: 1px;
	height: 13px;
    background-color: #e6e6e6;
    margin: -4px 8px 0 8px;
}
.other .other-c .txt{
    line-height: 22px;
    height: 64px;
    overflow: hidden;
    text-overflow:ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.other .other-c .btn{
    width: 100%;
    position: absolute;
    text-align: center;
    bottom: 0;
    left: 0;
}
.other .other-c .btn button{
    height: 30px;
    background-color: #fff;
    border-radius: 16px;
    border: solid 1px #e94f4f;
    color: #e94f4f;
    font-size: 12px;
    padding: 0 12px;
}
.other .other-c .btn button:first-child{
    margin-right: 10px;
}
.other .other-c .btn button:hover{
    background-color: #e94f4f;
    color: #fff;
}
.other .other-c .btn .black{
    border: 1px solid #a6a6a6;
    background-color: #a6a6a6;
    color: #fff;
}
.other .other-c .btn .black:hover{
    border: 1px solid #a6a6a6;
    background-color: #a6a6a6;
    color: #fff;
}
.other .other-c .indi{
    width: 100%;
    position: absolute;
    top: 114px;
    z-index: 1000;
}
.other .other-c .indi .icon-left {
    width: 28px;
    height: 28px;
    background-position: 0 -162px;
    position: absolute;
    left: 0;
    cursor: pointer;
}
.other .other-c .indi .icon-right {
    width: 28px;
    height: 28px;
    background-position: -57px -162px;
    position: absolute;
    right: 0;
    cursor: pointer;
}
.pass-ques{
    margin-top: 24px;
}
.pass-ques .item-h{
    padding: 0 10px;
}
.pass-ques .pass-ques-c li{
    padding: 14px 16px;
    border-top: 1px solid #e6e6e6;
    position: relative;
    height: 70px;
}
.pass-ques .pass-ques-c .title{
    color: #4e83da;
    line-height: 20px;
    height: 40px;
    overflow: hidden;
    text-overflow:ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.pass-ques .pass-ques-c .tip{
    position: absolute;
    width: 250px;
    bottom: 14px;
    left: 16px;
    color: #808080;
}
.qdet-l .ans .no-ans{
    color: #808080;
    width: 56px;
    height: 20px;
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    margin: auto;
}
.teacher{
    padding: 0 !important;
    height: 210px !important;
}
.teacher .teac-h{
    height: 42px;
    padding: 0 20px;
    border-bottom: 1px solid #e6e6e6;
    line-height: 42px;
    color: #ff6b6b;
}
.teacher .teac-h .icon-write{
    width: 16px;
    height: 14px;
    background-position: -767px -411px;
}
.teacher .teac-c{
    padding:18px 22px;
}
.teacher .teac-c .txt{
    width: 100%;
    resize: none;
    margin-top: 0;
    height: 78px;
    line-height: 18px;
    border: none;
}
.teacher .teac-c button{
    width: 89px;
	height: 38px;
	background-color: #ff6b6b;
    border-radius: 19px;
    color: #fff;
}
.teacher .teac-c .no{
    background-color: #cccccc;
}
